<!DOCTYPE html>
<html>
	<head>
		<title>Bootstrap 模板</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" charset="UTF-8" >
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link href="web/css/bootstrap.min.css" rel="stylesheet">
		<script src="web/js/jquery-1.11.1.min.js"></script>
		<script src="web/js/bootstrap.min.js"></script>
		<!--[if lt IE 9]>
		<script src="js/html5shiv.js"></script>
		<script src="js/respond.min.js"></script>
		<![endif]-->
		<style type="text/css">
			.hyym {
				display: block;
			}
			.zym {
				display: none;
			}
			.zcym {
				display: none;
			}
		</style>
		<script type="text/javascript">
			$(function() {
				$("#dl").click(function() {
					$(".hyym").css('display', 'none');
					$(".zym").css('display', 'block');
					$(".zcym").css('display', 'none');
				});
				$("#zc").click(function() {
					$(".hyym").css('display', 'none');
					$(".zym").css('display', 'none');
					$(".zcym").css('display', 'block');
				});
			});
		</script>
	</head>
	<body>
		<div class="container">
			<div class="row">
				<div class="col-xs-6 col-xs-offset-3">
					<div class="panel panel-primary" style="height: 300px;background: url(bj.jpg);">
						<div class="panel-heading">
							<div class="panel-title">
								ATM取款机
							</div>
						</div>
						<div class="panel-body text-center">
							<div class="hyym">
								<h3 >欢迎使用ATM系统</h3>
								<h4>请选择：</h4>
								<form class="form-horizontal" method="post" action="#">
									<div class="form-group">
										<label class="control-label col-xs-4">登录名:</label>
										<div class="col-xs-5">
											<input class="form-control" required="required"
											placeholder="登录名" name="yaccount" />
										</div>
									</div>
									<div class="form-group">
										<label class="control-label col-xs-4">密码:</label>
										<div class="col-xs-5">
											<input class="form-control" required="required" placeholder="密码"
											name="xpassword" />
										</div>
									</div>
									<div class="form-group" style="padding-left:50px">
										<button class="btn" id="dl">
											登录
										</button>
										<button class="btn" id="zc">
											注册
										</button>
										<button class="btn" id="gb">
											关闭
										</button>
									</div>
								</form>
							</div>
							<div class="zym">
								<br/>
								<br/>
								<br/>
								<div class="col-xs-6 col-xs-offset-3">
									<input class="form-control " required="required" placeholder="金额" />
								</div>
								<br/>
								<br/>
								<div>
									<button class="btn">
										余额
									</button>
									<button class="btn">
										存款
									</button>
									<button class="btn">
										取款
									</button>
									<button class="btn">
										退出
									</button>
								</div>

							</div>
							<div class="zcym">
								<div class="panel-heading">
									<div class="panel-lilte">
										<span class="glyphicon glyphicon-edit"> <b>修改登录信息</b> </span>
									</div>
								</div>
								<form class="form-horizontal" method="post" action="#">
									<div class="form-group">
										<label class="control-label col-xs-4">登录名:</label>
										<div class="col-xs-7">
											<input class="form-control" required="required"
											placeholder="登录名" name="yaccount" />
										</div>
									</div>
									<div class="form-group">
										<label class="control-label col-xs-4">密码:</label>
										<div class="col-xs-7">
											<input class="form-control" required="required" placeholder="密码"
											name="xpassword" />
										</div>
									</div>
									<div class="form-group">
										<label class="control-label col-xs-4">确认密码:</label>
										<div class="col-xs-7">
											<input class="form-control" required="required"
											placeholder="确认密码" name="xpassword1" />
										</div>
									</div>
									<div class="form-group">
										<button class="btn btn-primary col-xs-3  col-xs-offset-4"
										type="submit">
											注册
										</button>
									</div>
								</form>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>